<template>
	<view class="content-box">
		<view class="fixed">
			<view class="content1">
				<Head></Head>
			</view>
			<view class="content2">
				<Banner></Banner>
			</view>
		</view>
		<view>
			<swiper :indicator-dots="false" :autoplay="true" :interval="3000" :duration="500" class="swiper-box" :style="{'height':swiperHeight+'px'}">

				<swiper-item>
					<view class="swiper-item box1">
						<view style="opacity: 0;">
							<text>D’OVERBROECK'S SCHOOL</text>
							<text>德欧中学</text>
							<!--            <div class="line1"></div>-->

						</view>
						<view style="opacity: 0;">
							<text> A leading co-educational day and boarding school in Oxford</text>
							<text>牛津顶尖走读寄宿混合制学校（男女同校）</text>
						</view>
						<view class="sanjiao">
							<view>
								<image src="../../static/down.png" mode="widthFix" class="down-jiantou">
							</view>
						</view>
					</view>
				</swiper-item>
			</swiper>
			
			
			<view class="mid" >
			      <image src="../../static/dvb/DVB-NEW-LOGO-2014-clear.jpg" mode="widthFix" class="logo-img" >
			    </view>
			    <view class="mid">
			
			      <view>
			        <p><span>德欧中学</span>是位于牛津北部的一所顶尖的私立走读寄宿混合制学校, 男女同校。学校由三个学部组成：</p>
			        <ul>
			          <li>7年级至11年级：接收11至16岁学生。仅接收走读生。</li>
			          <li>Six Form学院：为16岁以上学生提供A-Level课程。全寄宿和周寄宿均可。Six Form学院50%学生为国际学生。</li>
			          <li>国际部：为11至16岁国际学生提供国际中学教育普通证书（IGCSE）课程及其预科课程。提供出国留学选项</li>
			        </ul>
			      </view>
			      <view>
			        <p>我们凭借独具特色且卓有成效的办学宗旨和卓越的教学质量赢得了极高的声誉。2020年，我们的学生取得了优异的成绩，65%的A-Level课程学生获得了A*或A的好成绩；68%的GCSE 课程学生成绩在7-9分之间（优秀）；62%的IGCSE课程学生成绩在7-9分之间（优秀）。</p>
			        <p>2019年，德欧中学连续第三年在A-Level考试中取得进步，被评为牛津郡顶尖学校，在英格兰排名前1%，帮助我们Six Form学院的学生取得了显著的学业进步。</p>
			      </view>
			    </view>
			    <view class="fangwen">
			      <a href="https://www.doverbroecks.com/" target="_blank">访问我们的网站</a>
			    </view>
			
		</view>
		<Foot></Foot>
	</view>
</template>

<script>
	import Head from '@/components/head.vue'
	import Banner from '@/components/banner.vue'
	import Foot from '@/components/foot.vue'
	export default {
		components: {
			Head,
			Banner,
			Foot
		},
		data() {
			return {
				swiperHeight: 0,
			};
		},
		onLoad() {
			let H = window.innerHeight
			let W = window.innerWidth
this.swiperHeight = H
			/* if (W > 750) {
				
			} else {
				this.swiperHeight = 300
			} */
		}
	}
</script>

<style lang="scss" scoped>
	@import url("../../css/zhongxue.css");

	.box1 {
		background: url("../../static/dvb/Students0310a-002.jpg") no-repeat center top;
		background-size: auto 100%;
	}
	.logo-img{
		width: 30%;display: block;
		margin-left: 30px;
	}
	.mid{
		padding-left: 60px;
	    margin: 40px auto 40px auto;
	    max-width: 1200px;
	    display: flex;
	    flex-direction: row;
	    justify-content: space-between;
	    font-size: 17px;
	    line-height: 36px;
	    view{
	      flex: 1;
	      width: 50%;
	      margin: 0 30px;
	      display: flex;
	      flex-direction: column;
	      p{
					margin-bottom: 25px;
	        span{
	          font-weight: bold;
	        }
	      }
	      ul{
	        display: flex;
	        flex-direction: column;
					margin-bottom: 20px;
	        li{
	          // margin-bottom: 15px;
	        }
	      }
	    }
	  }
	  .fangwen{
	    text-align: center;
	    margin: 50px auto 150px auto;
	    a{
	      padding: 18px 26px;
	      background: #303030;
	      color: #fff;
	      text-decoration: none;
	      transition: all 0.3s ease;
	    }
	    a:hover{
	      background: #3281c4;
	    }
	  }
		ul,li{
			list-style: none;
			padding: 0;
		}
		@media screen and (max-width: 750px){
			.mid{
				padding-left: 0px;
				flex-direction: column;
				align-items: center;
				font-size: 15px;
				// line-height: 25px;
				view{
					width: 90%;
				}
			}
			.logo-img{
				width: 70%;display: block;
				margin: 0 auto;
			}
			.sanjiao{
				// display: none;
			}
		}
</style>
